import { __awaiter, __generator } from "tslib";
import { PopoverDefaultProps } from './props';
import fmtEvent from '../_util/fmtEvent';
import mixinValue from '../mixins/value';
function getSystemInfo() {
    return new Promise(function (resolve, reject) {
        my.getSystemInfo({
            success: function (res) {
                resolve(res);
            },
            fail: function () {
                reject();
            },
        });
    });
}
function getBoundingClientRect(selector) {
    return new Promise(function (resolve, reject) {
        my.createSelectorQuery()
            .select(selector)
            .boundingClientRect()
            .exec(function (ret) {
            if (ret && ret[0]) {
                resolve(ret[0]);
                return;
            }
            reject();
        });
    });
}
function getStyle(obj) {
    return Object.keys(obj).map(function (item) { return "".concat(item, ": ").concat(obj[item], "px"); }).join(';');
}
Component({
    props: PopoverDefaultProps,
    data: {
        adjustedPlacement: '',
        popoverContentStyle: '',
    },
    mixins: [
        mixinValue({
            valueKey: 'visible',
            defaultValueKey: 'defaultVisible',
            transformValue: function (value) {
                if (value) {
                    this.updatePopover();
                }
                else {
                    this.setData({
                        adjustedPlacement: '',
                    });
                }
                return {
                    needUpdate: true,
                    value: value,
                };
            },
        }),
    ],
    didUpdate: function (prevProps, prevData) {
        if (prevProps.placement !== this.props.placement && this.getValue()) {
            this.updatePopover();
        }
    },
    methods: {
        updatePopover: function () {
            return __awaiter(this, void 0, void 0, function () {
                var _a, placement, autoAdjustOverflow, _b, containerRect, childrenRect, contentRect, systemInfo, left, top, bottom, right, adjustedPlacement, arrowMargin, contentRectWidth, contentRectHeight, popoverContentStyle;
                return __generator(this, function (_c) {
                    switch (_c.label) {
                        case 0:
                            _a = this.props, placement = _a.placement, autoAdjustOverflow = _a.autoAdjustOverflow;
                            return [4 /*yield*/, Promise.all([
                                    getBoundingClientRect("#ant-popover-children-".concat(this.$id)),
                                    getBoundingClientRect("#ant-popover-children-".concat(this.$id, " > *")),
                                    getBoundingClientRect("#ant-popover-content-".concat(this.$id)),
                                    getSystemInfo(),
                                ])];
                        case 1:
                            _b = _c.sent(), containerRect = _b[0], childrenRect = _b[1], contentRect = _b[2], systemInfo = _b[3];
                            left = childrenRect.left - containerRect.left;
                            top = childrenRect.top - containerRect.top;
                            bottom = containerRect.bottom - childrenRect.bottom;
                            right = containerRect.right - childrenRect.right;
                            adjustedPlacement = placement;
                            arrowMargin = 12;
                            contentRectWidth = contentRect.width + arrowMargin;
                            contentRectHeight = contentRect.height + arrowMargin;
                            if (autoAdjustOverflow) {
                                if (adjustedPlacement === 'top') {
                                    if (childrenRect.top - contentRectHeight < 0) {
                                        adjustedPlacement = 'bottom';
                                    }
                                }
                                else if (adjustedPlacement === 'bottom') {
                                    if (childrenRect.bottom + contentRectHeight > systemInfo.windowHeight) {
                                        adjustedPlacement = 'top';
                                    }
                                }
                                else if (adjustedPlacement === 'left') {
                                    if (childrenRect.left - contentRectWidth < 0) {
                                        adjustedPlacement = 'right';
                                    }
                                }
                                else if (adjustedPlacement === 'right') {
                                    if (childrenRect.right + contentRectWidth > systemInfo.windowWidth) {
                                        adjustedPlacement = 'left';
                                    }
                                }
                                else if (adjustedPlacement === 'top-left') {
                                    if (childrenRect.top - contentRectHeight < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('top', 'bottom');
                                    }
                                    if (childrenRect.left + contentRectWidth > systemInfo.windowWidth) {
                                        adjustedPlacement = adjustedPlacement.replace('left', 'right');
                                    }
                                }
                                else if (adjustedPlacement === 'top-right') {
                                    if (childrenRect.top - contentRectHeight < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('top', 'bottom');
                                    }
                                    if (childrenRect.right - contentRectWidth < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('right', 'left');
                                    }
                                }
                                else if (adjustedPlacement === 'bottom-left') {
                                    if (childrenRect.bottom + contentRectHeight > systemInfo.windowHeight) {
                                        adjustedPlacement = adjustedPlacement.replace('bottom', 'top');
                                    }
                                    if (childrenRect.left + contentRectWidth > systemInfo.windowWidth) {
                                        adjustedPlacement = adjustedPlacement.replace('left', 'right');
                                    }
                                }
                                else if (adjustedPlacement === 'bottom-right') {
                                    if (childrenRect.bottom + contentRectHeight > systemInfo.windowHeight) {
                                        adjustedPlacement = adjustedPlacement.replace('bottom', 'top');
                                    }
                                    if (childrenRect.right - contentRectWidth < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('right', 'left');
                                    }
                                }
                                else if (adjustedPlacement === 'left-top') {
                                    if (childrenRect.left - contentRectWidth < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('left', 'right');
                                    }
                                    if (childrenRect.top + contentRectHeight > systemInfo.windowHeight) {
                                        adjustedPlacement = adjustedPlacement.replace('top', 'bottom');
                                    }
                                }
                                else if (adjustedPlacement === 'left-bottom') {
                                    if (childrenRect.left - contentRectWidth < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('left', 'right');
                                    }
                                    if (childrenRect.bottom - contentRectHeight < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('bottom', 'top');
                                    }
                                }
                                else if (adjustedPlacement === 'right-top') {
                                    if (childrenRect.right + contentRectWidth > systemInfo.windowWidth) {
                                        adjustedPlacement = adjustedPlacement.replace('right', 'left');
                                    }
                                    if (childrenRect.top + contentRectHeight > systemInfo.windowHeight) {
                                        adjustedPlacement = adjustedPlacement.replace('top', 'bottom');
                                    }
                                }
                                else if (adjustedPlacement === 'right-bottom') {
                                    if (childrenRect.right + contentRectWidth > systemInfo.windowWidth) {
                                        adjustedPlacement = adjustedPlacement.replace('right', 'left');
                                    }
                                    if (childrenRect.bottom - contentRectHeight < 0) {
                                        adjustedPlacement = adjustedPlacement.replace('bottom', 'top');
                                    }
                                }
                            }
                            if (adjustedPlacement === 'top') {
                                popoverContentStyle = getStyle({
                                    left: left + childrenRect.width / 2,
                                    top: top - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'bottom') {
                                popoverContentStyle = getStyle({
                                    left: left + childrenRect.width / 2,
                                    bottom: bottom - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'left') {
                                popoverContentStyle = getStyle({
                                    left: left - arrowMargin,
                                    top: top + childrenRect.height / 2,
                                });
                            }
                            else if (adjustedPlacement === 'right') {
                                popoverContentStyle = getStyle({
                                    right: right - arrowMargin,
                                    top: top + childrenRect.height / 2,
                                });
                            }
                            else if (adjustedPlacement === 'top-left') {
                                popoverContentStyle = getStyle({
                                    left: left,
                                    top: top - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'top-right') {
                                popoverContentStyle = getStyle({
                                    right: right,
                                    top: top - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'bottom-left') {
                                popoverContentStyle = getStyle({
                                    left: left,
                                    bottom: bottom - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'bottom-right') {
                                popoverContentStyle = getStyle({
                                    right: right,
                                    bottom: bottom - arrowMargin,
                                });
                            }
                            else if (adjustedPlacement === 'left-top') {
                                popoverContentStyle = getStyle({
                                    left: left - arrowMargin,
                                    top: top,
                                });
                            }
                            else if (adjustedPlacement === 'left-bottom') {
                                popoverContentStyle = getStyle({
                                    left: left - arrowMargin,
                                    bottom: bottom,
                                });
                            }
                            else if (adjustedPlacement === 'right-top') {
                                popoverContentStyle = getStyle({
                                    right: right - arrowMargin,
                                    top: top,
                                });
                            }
                            else if (adjustedPlacement === 'right-bottom') {
                                popoverContentStyle = getStyle({
                                    right: right - arrowMargin,
                                    bottom: bottom,
                                });
                            }
                            this.setData({
                                popoverContentStyle: popoverContentStyle,
                                adjustedPlacement: adjustedPlacement,
                            });
                            return [2 /*return*/];
                    }
                });
            });
        },
        onVisibleChange: function (e) {
            if (!this.getValue() && e.target.id && e.target.id.indexOf('ant-popover-') === 0) {
                return;
            }
            var onVisibleChange = this.props.onVisibleChange;
            var value = !this.getValue();
            if (!this.isControlled()) {
                this.update(value);
            }
            if (onVisibleChange) {
                return onVisibleChange(value, fmtEvent(this.props));
            }
        },
    },
});
